import React, { Component } from 'react';
import { Link } from 'react-router-dom';
export default class Navbar extends Component {
  constructor(props) {
    super(props);
    this.state = {
      menuList: [
        { title: '账户首页', href: '/user/center', icon: 'icon-home' },
        { title: '个人中心', href: '/user/info', icon: 'icon-user' },
        { title: '我的订单', href: '/user/order', icon: 'icon-order' },
        { title: `优惠券 `, href: '/user/coupon', icon: 'icon-coupon' },
        // { title: '我的积分', href: '/user/point', icon: 'icon-point' },
        { title: '我的收藏', href: '/user/collect', icon: 'icon-usercollect' },
        { title: '我的评价', href: '/user/comment', icon: 'icon-comment' },
        { title: '安全设置', href: '/user/security', icon: 'icon-security' },
        { title: '消息中心', href: '/user/message', icon: 'icon-message' }
      ]
    };
  }
  render() {
    const { menuList } = this.state;
    const { pathname } = this.props.location;

    return (
      <ul className="userNav">
        {menuList.map((item, index) => (
          <Link
            key={index}
            className={`navItem ${
              pathname.indexOf(item.href) > -1 ? 'active' : ''
            }`}
            to={item.href}
          >
            <div className="dfr">
              <div style={{ width: '1.2rem' }}>
                <i className={`iconfont ${item.icon}`} />
              </div>
              <a style={{ fontSize: '0.64rem', color: '#fff' }}>{item.title}</a>
            </div>
          </Link>
        ))}
      </ul>
    );
  }
}
